<template>
  <el-dialog
    v-model="dialogVisibleDevice"
    title="会员列表"
    width="800px"
    class="device-dialog-box"
    :before-close="handleClose"
  >
    <div class="table-device-box">
      <el-table
        :data="tableData"
        height="550px"
        stripe
        :header-cell-style="{
          color: '#828A9D',
          textAlign: 'center',
          height: '60px',
        }"
        :cell-style="{ textAlign: 'center', color: '#1B2431' }"
      >
        <el-table-column fixed prop="date" label="手机号" />
        <el-table-column prop="name" label="会员时长" />
        <el-table-column prop="zip" label="操作">
          <el-button type="primary" link>取消会员</el-button>
        </el-table-column>
      </el-table>
    </div>
  </el-dialog>
</template>
<script setup>
import {
  computed,
  watch,
  onMounted,
  getCurrentInstance,
  ref,
  defineEmits,
  nextTick,
} from 'vue'
const { proxy: that } = getCurrentInstance()
const props = defineProps({
  show: {
    type: Boolean,
    default: () => {
      return false
    },
  },
  tableData: {
    type: Array,
    default: () => {
      return []
    },
  },
})
let dialogVisibleDevice = ref(false)
watch(
  () => props.show,
  (newValue, oldValue) => {
    dialogVisibleDevice.value = props.show
  }
)
const emit = defineEmits(['onClose'])
const handleClose = () => {
  emit('onClose', false)
}
const chargingSubmitFUnc = () => {}
</script>
<style lang="scss">
@import './store_dislog.scss';
</style>